 <!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<link rel="stylesheet" href="css/logo.css" />
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="js/index2.js"></script>
	<link rel="stylesheet" type="text/css" href="css/center.css">
	<title>个人资料</title>
</head>
<body>
	<!--页头-->
	<div id="dingdan"></div>
	<style type="text/css">	
	th,td{
		padding: 10px;
	}
	.inputst{
	width: 200px;
	}
	.importfont{
		color: deepskyblue;
	}
	#headimg{
		border: none;
		height: 75px;
		width: 75px;
	}
	#font{
		position: absolute;
		left: 50px;
		border: none;
	}
	#sexbox{
		padding-left:25px;
	}
	#city{
		margin-left:10px;
	}
	#birthday{
		margin-left: 15px;
	}
	</style>
	<!-- 顶部标题 -->
	<div class="bgf5 clearfix">
		<div class="top-user">
			<div class="inner">
				<a class="logo" href="index.html"><li id="logo"></li></a>
				<div class="title">个人中心</div>
			</div>
		</div>
	</div>
	<div class="content clearfix bgf5" style="height: 1200px;">
		<section class="user-center inner clearfix">
			<div id="caidan" style="position: absolute;">
            	
            </div>
            <div class="pull-right">
				<div class="user-content__box clearfix bgf">
					<div class="title">账户信息-个人资料</div>
					<div style="margin-left:20px;float: left;">
					<div style="margin:0 20px 0 0;padding:10px 20px 50px 0px ;width: 700px;">
						<div id="namebox" style="padding:30px 0 0 20px;font-size:20px;">
							
						</div>
						<table>
							<tr>
								<th>当前头像：</th>
								<td>
									<div class='port b-r50' id='crop-avatar'>
										<div class='img' id="headimg">
											
										</div>
									</div>
								</td>
							</tr>
							<tr>
								<th>*昵称：</th>
								<td id="nicknamebox">
									
								</td>
							</tr>
							<tr>
								<th>真实姓名：</th>
								<td id="realnamebox">
									
								</td>
							</tr>
							<tr>
								<th>出生日期：</th>
								<td id="birthdaybox">
									
								</td>
							</tr>
							<tr>
								<th>
									*性别：
								</th>
								<td id="sexbox">
									
								</td>
							</tr>
							<tr>
								<th>居住地</th>
								<td id="livebox" style="position: relative;">
									<input type='text' id='city' value="请输入地址范围..." class='form-control inputst' style=' text-align:center'/>
								</td>
							</tr>
							<tr>
								<th></th>
								<td>
									<div class="user-form-group">
										<button id="changebutton" type="button" class="btn">确认修改</button>
									</div>
								</td>
							</tr>
						</table>	
					</div>
				</div>
   			</div>
			<script src="js/zebra.datepicker.min.js"></script>
			<link rel="stylesheet" href="css/zebra.datepicker.css">
			<script>
				$('input.datepicker').Zebra_DatePicker({
					default_position: 'below',
					show_clear_date: false,
					show_select_today: false,
				});
			</script>
		</section>
	</div>
	<script type="text/javascript">
	$(function(){//第一步都得写这个
		$(document).on("click",".centers_listm_one_in",function(){
		$(this).next(".gjszmdm").slideToggle().siblings("gjszmdm").slideUp()
		});
	})
	/*$(document).ready(function(){ $('.to-top').toTop({position:false}) });*/
	</script>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="udai_welcome.html" class="r-item-hd">
					<i class="iconfont icon-user" data-badge="0"></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_shopcart.html" class="r-item-hd">
					<i class="iconfont icon-cart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="Commodity_collection.html" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="issues.html" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 头像选择模态框 -->
	<link href="css/cropper/cropper.min.css" rel="stylesheet">
	<link href="css/cropper/sitelogo.css" rel="stylesheet">
	<script src="js/cropper/cropper.min.js"></script>
	<script src="js/cropper/sitelogo.js"></script>
	<div class="modal fade" id="avatar-modal" aria-hidden="true" aria-labelledby="avatar-modal-label" role="dialog" tabindex="-1">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<form action="http://localhost:16600/f_changeheadimg" class="avatar-form" id="changeimgbox" enctype="multipart/form-data" >
					<input type="hidden" id="userid" name="user_id" value="">
					<div class="modal-header">
						<button class="close" data-dismiss="modal" type="button">&times;</button>
						<h4 class="modal-title" id="avatar-modal-label">Change Logo Picture</h4>
					</div>
					<div class="modal-body">
						<div class="avatar-body">
							<div class="avatar-upload">
								<input class="avatar-src" name="avatar_src" type="hidden">
								<input class="avatar-data" name="avatar_data" type="hidden">
								<label for="avatarInput">图片上传</label>
								<input class="avatar-input" id="avatarInput" name="avatar_file" type="file">
							</div>
							<div class="row">
								<div class="col-md-9">
									<div class="avatar-wrapper"></div>
								</div>
								<div class="col-md-3">
									<div class="avatar-preview preview-lg"></div>
									<div class="avatar-preview preview-md"></div>
									<div class="avatar-preview preview-sm"></div>
								</div>
							</div>
							<div class="row avatar-btns">
								<div class="col-md-9">
									<div class="btn-group">
										<button class="btn" data-method="rotate" data-option="-90" type="button" title="Rotate -90 degrees"><i class="fa fa-undo"></i> 向左旋转</button>
									</div>
									<div class="btn-group">
										<button class="btn" data-method="rotate" data-option="90" type="button" title="Rotate 90 degrees"><i class="fa fa-repeat"></i> 向右旋转</button>
									</div>
								</div>
								<div class="col-md-3">
									<input id="imgchangebut" class="btn btn-success btn-block avatar-save" type="submit" value="保存修改"></input>
								</div>
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<div class="loading" aria-label="Loading" role="img" tabindex="-1"></div>
	<!-- 底部信息 -->
	<div class="footer" style="position: absolute;top: 1300px;width: 100%;">
		<div class="footer-tags">
			<div class="tags-box inner">
				<div class="tag-div">
					<img src="images/icons/footer_1.gif" alt="厂家直供">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_2.gif" alt="一件代发">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_3.gif" alt="美工活动支持">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_4.gif" alt="信誉认证">
				</div>
			</div>
		</div>
		<div class="footer-links inner">
			<dl>
				<dt>富城百货</dt>
				<a href="temp_article/udai_article10.html"><dd>企业简介</dd></a>
				<a href="temp_article/udai_article11.html"><dd>加入U袋</dd></a>
				<a href="temp_article/udai_article12.html"><dd>隐私说明</dd></a>
			</dl>
			<dl>
				<dt>服务中心</dt>
				<a href="temp_article/udai_article1.html"><dd>售后服务</dd></a>
				<a href="temp_article/udai_article2.html"><dd>配送服务</dd></a>
				<a href="temp_article/udai_article3.html"><dd>用户协议</dd></a>
				<a href="temp_article/udai_article4.html"><dd>常见问题</dd></a>
			</dl>
			<dl>
				<dt>新手上路</dt>
				<a href="temp_article/udai_article5.html"><dd>如何成为代理商</dd></a>
				<a href="temp_article/udai_article6.html"><dd>代销商上架教程</dd></a>
				<a href="temp_article/udai_article7.html"><dd>分销商常见问题</dd></a>
				<a href="temp_article/udai_article8.html"><dd>付款账户</dd></a>
			</dl>
		</div>
		<div class="copy-box clearfix">
			<ul class="copy-links">
				<a href="agent_level.html"><li>网店代销</li></a>
				<a href="class_room.html"><li>U袋学堂</li></a>
				<a href="udai_about.html"><li>联系我们</li></a>
				<a href="temp_article/udai_article10.html"><li>企业简介</li></a>
				<a href="temp_article/udai_article5.html"><li>新手上路</li></a>
			</ul>
			<!-- 版权 -->
			<p class="copyright">
				© 2005-2017 XXX 版权所有，并保留所有权利<br>
				ICP备案证书号：闽ICP备XXX号-2&nbsp;&nbsp;&nbsp;&nbsp;福建省宁德市XXX&nbsp;&nbsp;&nbsp;&nbsp;Tel: XXX&nbsp;&nbsp;&nbsp;&nbsp;E-mail: XXX@qq.com
			</p>
		</div>
	</div>
</body>

</html>
<script type="text/javascript">
	//顶端导入
	$("#dingdan").load("index_head.html");
	
	//var userid = sessionStorage.getItem("userid");
	
	//获得userid//
	function getUserid(cookieName) {
	    var strCookie = document.cookie;
	    var arrCookie = strCookie.split("; ");
	    for(var i = 0; i < arrCookie.length; i++){
	        var arr = arrCookie[i].split("=");
	        if(cookieName == arr[0]){
	            return arr[1];
	        }
	    }
	    return "";
	}
	
	var userid=getUserid("userid");

$(document).ready(function(){
	$("#userid").val(userid);
	//显示个人资料//
	$.ajax({
        type:"GET",
        url:"http://localhost:16111/user/selectmydata?userid="+userid,
        dataType:"json",
        xhrFields:{withCredentials: true},
        success:function(result){
        	//添加登录名//
            $("#namebox").append("<p>亲爱的<span class='importfont'>"+result.account+"</span>，填写真实的资料，有助于好友找到你哦。</p>");
           	//添加头像（带空值判断）//
           	if(result.userData.user_img==null){
           		$("#headimg").append("<img  id='headimg' src='user/headimg/fcbh.png' class='cover b-r50'>");
           	}else{
           		$("#headimg").append("<img  id='headimg' src='"+result.userData.user_img+"' class='cover b-r50'>");	
           	}
            //添加昵称//
            $("#nicknamebox").append("<div class='col-sm-6'><input class='form-control inputst' id='nickname' value='"+result.userData.user_name+"' type='text'></div>");
            //添加真实姓名（带空值判断）//
            if(result.userData.user_zsxm==null){
            	$("#realnamebox").append("<div class='col-sm-6'><input class='form-control inputst' id='realname' placeholder='请输入姓名' type='text'></div>");
            }else{
            	$("#realnamebox").append("<div class='col-sm-6'><input class='form-control inputst' id='realname' value='"+result.userData.user_zsxm+"' type='text'></div>");
            }
            //添加生日//
           	$("#birthdaybox").append("<input class='form-control inputst' id='birthday' value='"+/\d{4}-\d{1,2}-\d{1,2}/g.exec(result.userData.user_birthday)+"' type='date'>");
            //添加性别（带空值判断）//
            if(result.userData.user_gender=="1"){
            	$("#sexbox").append("<label><input name='sex' type='radio' value='1' checked='checked'/>男&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='2'/>女&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='0'/>保密&nbsp;&nbsp;&nbsp;</label>");
            }else if(result.userData.user_gender=="2"){
            	$("#sexbox").append("<label><input name='sex' type='radio' value='1'/>男&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='2' checked='checked'/>女&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='0'/>保密&nbsp;&nbsp;&nbsp;</label>");
            }else{
            	$("#sexbox").append("<label><input name='sex' type='radio' value='1'/>男&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='2'/>女&nbsp;&nbsp;&nbsp;</label><label><input name='sex' type='radio' value='0' checked='checked'/>保密&nbsp;&nbsp;&nbsp;</label>");
            }
            //添加默认居住地（带空值判断）//
            if(result.userData.user_area!=null){
            	$("#city").val(result.userData.user_area);
            }
            
        }	
    });
})

	//菜单
	memu ();
	function memu ()
	{
	
		var list = "";
		$.ajax({
		    type: "post",//请求方式
		    url: "http://localhost:16111/user/MenuSelect",//上s层的路径
			dataType: "json",
		    data:{},//传值
		    xhrFields:{withCredentials: true},
		    success: function (data)
			{
				var user = eval('(' + JSON.stringify(data.data) + ')');
				
				
				list += '<div class=\"centers_listm_one\">'+
            	'<img src=\"images/zshy.png\"/>'+
                '<a href='+user.memu_url+'><em>'+user.memu_name+'</em></a>'+
            	'</div>';
            	for(var i in user.childMemu)
            	{
            		
            		list +='<div class=\"centers_listm_one_in\">'+
                '<img src=\"images/kouw.png\"/>'+
                '<em>'+user.childMemu[i].memu_name+'</em>'+
                '<b></b>'+
            	'</div>'+
            	'<span class="gjszmdm">';
            		for(var x in user.childMemu[i].childMemu)
            		{
            			if(user.childMemu[i].childMemu[x].memu_name=="宝贝收藏")
            			{
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+'?userid='+sessionStorage.getItem("userid")+' class=\"center_in_self\"  target =\"_blank\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}else if(user.childMemu[i].childMemu[x].memu_name=="我的足迹")
            			{ 	
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+'?userid='+sessionStorage.getItem("userid")+' class=\"center_in_self\" target =\"_blank\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}else 
            			{
            				list += 
		                '<a href='+user.childMemu[i].childMemu[x].memu_url+' class=\"center_in_self\"><font>'+user.childMemu[i].childMemu[x].memu_name+'</font></a>';
            			}
            			
		            	
            		}
            		list+='</span>';
            	} 
            	
            	$("#caidan").html(list);
		   }
		})		
		
	}
////修改头像//
//$("#imgchangebut").click(function(){
//	$.ajax({
//      type:"POST",
//      url:"http://localhost:16111/user/f_changeheadimg",
//      dataType:"json",
//      data:$("#changeimgbox").serialize(),
//      cache: false,
//		contentType: "multipart/form-data",
//		processData: false,
//      xhrFields:{withCredentials: true},
//      success:function(data){
//        if(data){
//        	alert("头像修改成功");
//        	//重新加载头像//
//			$(location).attr('href', 'udai_setting.html');
//        }else{
//        	alert("修改失败，请在检查网络后重新再试");                         
//        }
//      },
//      error:function(jqXHR){
//          console.log("Error: "+jqXHR.status);
//      }
//  });
//});
$("#imgchangebut").click(function(){
	//重新加载头像//
	$(location).attr('href', 'udai_setting.html');
});
//提交修改数据//
$("#changebutton").click(function(){
    $.ajax({
        type:"GET",
        url:"http://localhost:16111/user/datachange?account="+$("#nickname").val()+"&user_zsxm="+$("#realname").val()+"&user_birthday="+$("#birthday").val()+"&user_gender="+$("input:radio:checked").val()+"&user_area="+$("#city").val()+"&user_id="+userid,
        dataType:"json",
        xhrFields:{withCredentials: true},
        success:function(data){
          if(data){
          	alert("修改成功");
          	$(location).attr('href', 'udai_setting.html');
          }else{
          	alert("修改失败，请在检查网络后重新再试");                         
          }
        },
        error:function(jqXHR){
            console.log("Error: "+jqXHR.status);
        }
    });
});
</script>
</html>


